// 引入request请求函数
import { request } from '../../request/request'
import { showToast } from '../../utils/wxAsync'

Page({

  /**
   * 页面的初始数据
   */
  data: {
    // 地址信息
    addressInfo: {
      id:0,
      province_id: 0,
      city_id: 0,
      district_id: 0,
      address: '',
      full_region: '',
      name: '',
      mobile: '',
      is_default: 0
    },
    // 省份、城市、区县数据
    regionList: [],
    // 选中的省市区
    selectedRegion: [],
    // 激活状态的类型(1: 省份  2: 城市  3: 区县)
    activeType: 1,
    // 让选中的省市区对象显示在视图中
    toIndex: '',
    // 控制省市区选择器显示
    hideSectionPage: true,
    // 新增操作或者编辑操作
    operation: ''
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    // 获取传递参数
    const id = options.id
    if (!id) {
      // 若id不存在，则为新增操作
      this.setData({
        operation: 'add'
      })
    } else {
      // 若id存在，则为编辑操作
      this.setData({
        operation: 'edit'
      })
      this.getAddressInfo(id)
    }
    // 获取省份，省份的parentId = 1(county_id)
    this.getRegionList(1)
  },
  // 根据传递参数id，发送请求获取地址信息
  async getAddressInfo(id) {
    const res = await request({url: '/address/detail', data: { id }})
    this.setData({
      addressInfo: res.data
    })
  },
  // 发送请求获取省市区数据
  async getRegionList(parentId) {
    const res = await request({url: '/region/list', data: { parentId }})
    let { selectedRegion, toIndex, activeType } = this.data
    // 若已选择了省市区，再次点击标签，让选中的对象显示在视图中(即滚动到该选中项的位置)
    if (selectedRegion.length !== 0) {
      toIndex = 'v' + selectedRegion[activeType - 1].id
    }
    this.setData({
      regionList: res.data,
      toIndex
    })
  },
  // 监听点击省市区事件
  handleSelectRegion(e) {
    // 获取被点击选项的id值和type
    const { id, type } = e.currentTarget.dataset
    let { regionList, selectedRegion } = this.data
    // 获取被点击省份、城市、区县的索引值
    let index =  regionList.findIndex(item => item.id === id)
    // 替换选中省市区数组中，对应索引(type - 1)的内容
    selectedRegion[type - 1] = regionList[index]
    // 清除原有的下级数据内容
    selectedRegion.splice(type)
    // 更新页面显示数据
    this.setData({
      selectedRegion,
      // 让激活状态等于被点击对象的type
      activeType: type
    })
    if (type === 3) {
      // 若type = 3,则为区县，不显示下一级数据
      return
    }
    // 根据点击的选项id值，显示下一级数据
    this.getRegionList(id)
  },
  // 点击省市区、标签栏
  handleTab(e) {
    // 获取被点击标签的parent_id和索引值index
    const parentId = e.currentTarget.dataset.id
    const { index } = e.currentTarget.dataset
    // 显示当前级别的数据
    this.getRegionList(parentId)
    this.setData({
      activeType: index + 1
    })
  },
  // 点击mask背景关闭选择器页面,点击省份输入框显示选择器页面
  handleHidePage(e) {
    const { params } = e.currentTarget.dataset
    this.setData({
      hideSectionPage: params
    })
  },
  // 点击确定按钮，更新省份输入框的值
  handleConfirm() {
    let { addressInfo, selectedRegion } = this.data
    // 若省市区选择不全，直接return
    if (selectedRegion.length < 3) {
      return
    }
    // 更新地址信息的内容，便于渲染
    addressInfo.province_id = selectedRegion[0].id
    addressInfo.province_name = selectedRegion[0].name

    addressInfo.city_id = selectedRegion[1].id
    addressInfo.city_name = selectedRegion[1].name

    addressInfo.district_id = selectedRegion[2].id
    addressInfo.district_name = selectedRegion[2].name

    addressInfo.full_region = selectedRegion.map(item => item.name).join('')
    this.setData({
      addressInfo,
      // 关闭选择器页面
      hideSectionPage: true
    })
  },
  // 监听其他输入框失去焦点事件
  async handleBlur(e) {
    const { params } = e.currentTarget.dataset
    let { value } = e.detail
    let { addressInfo } = this.data
    // 根据参数判断输入框的类型，并赋值
    if (params === 'username') {
      // 姓名输入框
      addressInfo.name = value.trim()
    } else if (params === 'mobile') {
      // 手机输入框
      addressInfo.mobile = value.trim()
    } else {
      // 详细地址输入框
      addressInfo.address = value.trim()
    }
  },
  // 监听复选框状态更改事件
  checkBoxChange() {
    let { addressInfo } = this.data
    // 若默认地址为0 或者不存在，点击让其更改为1
    if (addressInfo.is_default === 0 || !addressInfo.is_default) {
      addressInfo.is_default = 1
    } else {
      addressInfo.is_default = 0
    }
    this.setData({
      addressInfo
    })
  },
  // 监听点击保存事件
  async saveAddress() {
    let { addressInfo, operation } = this.data
    // 验证提交信息
    if (addressInfo.name === '') {
      await showToast({title: '请输入姓名', icon: 'none'})
      return
    }
    if (!(/^1[3456789]\d{9}$/.test(addressInfo.mobile))) {
      await showToast({title: '手机格式错误', icon: 'none'})
      return
    }
    if (addressInfo.address === '') {
      await showToast({title: '请输入详细地址', icon: 'none'})
      return
    }
    if (addressInfo.full_region === '') {
      await showToast({title: '请选择省份、城市、区县', icon: 'none'})
      return
    }
    // 修改默认地址的提交参数
    addressInfo.is_default = addressInfo.is_default === 0 ? false : true
    // 发送请求，保存地址
    const res = await request({url: '/address/save', method: 'POST', data: addressInfo})
    // 修改或者新增给予提示，并返回至上一页面
    if (res.errno === 0) {
      // 判断为新增或者修改操作
      if (operation === 'edit') {
        await showToast({title: '修改地址成功', icon: 'success'})
      } else {
        await showToast({title: '新增地址成功', icon: 'success'})
      }
      // 返回上一页面
      setTimeout(() => {
        wx.navigateBack({
          delta: 1
        })
      },1500)
    } else {
      if (operation === 'edit') {
        await showToast({title: '修改地址失败', icon: 'none'})
      } else {
        await showToast({title: '新增地址失败', icon: 'none'})
      }
      return
    }
  }
})